<template>
  <view class="app-container owner-info-page">
    <view class="form-wrapper">
      <hxk-section>
        <view class="list">
          <template v-if="form.proprietorType === OWNER_TYPE.PERSONAL">
            <view class="item">
              <view class="label">
                <text>名称</text>
              </view>
              <view class="value">
                <text>{{ form.proprietorName }}</text>
              </view>
            </view>
<!--            8u<view class="item">-->
<!--              <view class="label">-->
<!--                <text>手机号</text>-->
<!--              </view>-->
<!--              <view class="value">-->
<!--                <text>{{ form.proprietorMobile }}</text>-->
<!--              </view>-->
<!--            </view>-->
            <view class="item">
              <view class="label">
                <text>身份证</text>
              </view>
              <view class="value">
                <text>{{ form.cardNumber }}</text>
              </view>
            </view>
          </template>

          <template v-if="form.proprietorType === OWNER_TYPE.ENTERPRISE">
            <view class="item">
              <view class="label">
                <text>企业名称</text>
              </view>
              <view class="value">
                <text>{{ form.proprietorName || '/'}}</text>
              </view>
            </view>
            <view class="item">
              <view class="label">
                <text>统一社会信用证</text>
              </view>
              <view class="value">
                <text>{{ form.socialCreditCode }}</text>
              </view>
            </view>
          </template>

        </view>
      </hxk-section>

      <hxk-section title="房屋委托打款账号" v-if="form.houseCommission">
        <view class="list">
          <view class="item">
            <view class="label">
              <text>卡号</text>
            </view>
            <view class="value">
              <text>{{ form.houseCommission.bankAccount }}</text>
            </view>
          </view>
          <view class="item">
            <view class="label">
              <text>开户银行</text>
            </view>
            <view class="value">
              <text>{{ form.houseCommission.bankName }}</text>
            </view>
          </view>
          <view class="item">
            <view class="label">
              <text>银行支行</text>
            </view>
            <view class="value">
              <text>{{ form.houseCommission.bankBranch }}</text>
            </view>
          </view>
        </view>
      </hxk-section>

      <hxk-section title="代理服务打款账号" v-if="form.proxyService">
        <view class="list">
          <view class="item">
            <view class="label">
              <text>银行卡类型</text>
            </view>
            <view class="value">
              <text>{{ bankAccountTypeMapping[form.proxyService.bankAccountType] || '-'}}</text>
            </view>
          </view>
          <view class="item">
            <view class="label">
              <text>卡号</text>
            </view>
            <view class="value">
              <text>{{ form.proxyService.bankAccount || '-'}}</text>
            </view>
          </view>
          <view class="item">
            <view class="label">
              <text>开户银行</text>
            </view>
            <view class="value">
              <text>{{ form.proxyService.bankName || '-'}}</text>
            </view>
          </view>
          <view class="item">
            <view class="label">
              <text>银行支行</text>
            </view>
            <view class="value">
              <text>{{ form.proxyService.bankBranch || '-' }}</text>
            </view>
          </view>
        </view>
      </hxk-section>


    </view>

  </view>
</template>

<script>
import {ownerInfo} from "@/api/mine/owner";
import HxkSection from "@/components/hxk-section/index";
import {OWNER_TYPE} from "@/components/app-constant";

export default {
  computed: {
    OWNER_TYPE() {
      return OWNER_TYPE
    }
  },
  components: {
    HxkSection
  },
  data() {
    return {
      bankAccountTypeMapping: {
        "1": "对私法人",
        "2": "对公账户"
      },
      form: {}
    };
  },
  created() {
    this.getInfo()
  },
  methods: {
    getInfo() {
      ownerInfo().then(res => {
        this.form = res.data;
      })
    }
  },
}
</script>

<style lang="scss" scoped>
.owner-info-page {
  .form-wrapper {
    //padding: 20rpx;
    background-color: #ffffff;

    .list {
      .item {
        display: flex;
        padding: 20rpx 0;
        border-bottom: 1rpx solid #f5f5f5;

        &:last-child {
          border-bottom: none;
        }

        .label {
          width: 160rpx;
          text {
            font-size: 28rpx;
            color: #333333;
          }
        }

        .value {
          flex: 1;
          text {
            font-size: 28rpx;
            color: #666666;
          }
        }
      }
    }
  }
}

</style>
